(function($f) {	$f.extend.custom("myPlugin1", function(self) {

	"use strict";
	
	// plugin info
	this.info = {
		title: "My Plugin 1",
		version: "0.0.1", // major.minor.build
		description: "This is my first plugin."
	};

	// plugin variables
	// value of these variables is NOT maintained across page refresh
	this.vars = { 
		lifeCycleDiv: null
	};
	
	// a property over a variable
	// this will be used by plugin 2
	this.lifeCycleElement = function() {
		return self.vars.lifeCycleDiv;
	};
	
	// pre-initialization handler
	// called just after plugin instance is created and no features or includes are processed
	// returns (boolean): 
	//	true: if success 
	//	false: if failed
	this.onPreInit = function() { 
		// find element
		// Note: jQuery is available
		self.vars.lifeCycleDiv = $("#lifecycle");
		
		// log
		self.vars.lifeCycleDiv.append("<p><b>preInit:</b> " + self.info.title + " is instantiated and will be initialized.");

		return true;
	};
	
	// initialization handler
	// called when all includes are processed and features etc. are added
	// returns (boolean): 
	//	true: if success 
	//	false: if failed
	this.onInit = function() { 
		// log
		self.vars.lifeCycleDiv.append("<p><b>init:</b> " + self.info.title + " is initialized now.");

		return true;
	};

	// load handler
	// returns: (void)
	this.onLoad = function() {
		// log
		self.vars.lifeCycleDiv.append("<p><b>load:</b> " + self.info.title + " is loaded now.");
	};
	
	// ready handler
	// returns: (void)
	this.onReady = function() {
		// log
		self.vars.lifeCycleDiv.append("<p><b>ready:</b> Plugin is ready now. " + self.info.title + " will do ready-time processing now.");
	
		// show plugins list now
		self.showPluginsList();
	};
	
	// unload handler
	// returns: (void)
	this.onUnload = function() { 
		// Application is unloading, plugin can do any unload time processing now.
		// alerts don't work from within this method
	};
	
	// show plugins list
	this.showPluginsList = function() {
		var div = $("#list");
		
		// load plugins list
		var list = "<table class='table table-bordered'><tr><th align='left'>Name</th><th align='left'>Id</th><th align='left'>Version</th><th align='left'>Description</th></tr>";
		$.each($f.all.plugins(), function(i, plugin) {
			var className = (plugin.handle.name.indexOf("myPlugin") === 0 ? "info" : "");
			list += "<tr class='" + className + "'><td style='vertical-align: top'>" + plugin.handle.name + 
				    "</td><td>" + plugin.handle.id + 
					"</td><td>" + plugin.info.version.version + 
					"</td><td>" + plugin.info.description + 
					"</td></tr>";
		});
		list += "</table>";
		div.empty().append(list);
	};
}); }(fluid));
